import { queryString } from '..//tools.js';
import { APIGoodsList } from '..//fetch.js';

$('#head').load('../dewu/head.html');
$('#foot').load('../dewu/foot.html');

var key = queryString('key');
var page = 1;
var size = 12;

goodList(true);
var timer = null;

$(document).on('input','.ipt',function(ev){
    page = 1;
    key = $(ev.target).val();
    clearTimeout(timer);
    timer = setTimeout(() => {
        goodList(true)
    }, 500);
})

function goodList(tag) {
    APIGoodsList({
        key,
        page,
        size
    }).then(({ data,count }) => {
        console.log(data);
        var html = '';
        $.each(data, function (index, { img, gname, price }) {
            html += `
             <div class="clear-a">
                 <div class="box2"><a href="#"><img
                    src="${img}"
                    alt=""></a></div>
                    <p class="box3">${gname}</p>
                    <P class="box4">￥${price}</P>
                    <p class="box6"><img src="" alt=""></p>
            </div>
             `
        })
        $('#clear').html(html);

        if (tag) {
            layui.use('laypage', function () {
                var laypage = layui.laypage;

                //执行一个laypage实例
                laypage.render({
                    elem: 'search-pagination', //注意，这里的 test1 是 ID，不用加 # 号
                    limit: size,
                    count //数据总数，从服务端得到
                    , jump: function (obj, first) {
                        //obj包含了当前分页的所有参数，比如：
                        console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                        // console.log(obj.limit); //得到每页显示的条数

                        //首次不执行
                        if (!first) {
                            //do something
                            page = obj.curr;
                            goodList();
                        }
                    }
                });
            });
        }
    })
} goodList()